<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单查看</title>
    <script type="text/javascript" src="./js/vue.js"></script>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" href="css/weui.css">
    <link rel="stylesheet" href="css/jquery-weui.css">
    <link rel="stylesheet" href="css/style.css">
    <script>
        function getCookie(c_name)
        {
            if (document.cookie.length>0)
            {
                c_start=document.cookie.indexOf(c_name + "=")
                if (c_start!=-1)
                {
                    c_start=c_start + c_name.length+1
                    c_end=document.cookie.indexOf(";",c_start)
                    if (c_end==-1) c_end=document.cookie.length
                    return unescape(document.cookie.substring(c_start,c_end))
                }
            }
            return ""
        }
        function getQueryString(name) {
            var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
            var r = window.location.search.substr(1).match(reg);
            if (r != null) {
                return unescape(r[2]);
            }
            return null;
        }
    </script>

    <style>
        .products-list .weui-media-box_appmsg .weui-media-box__hd{
            width: 80px;
            height: 80px;
        }
        .products-list .weui-media-box{
            padding:10px;
        }
        .products-list .weui-media-box__title{
            font-size: 15px;
            padding-right: 48px;
            white-space:normal;
            line-height: 20px;
            min-height: 54px;
            display: -webkit-box;
            -webkit-box-align:center;
            -moz-box-align:center;
            position: relative;
        }
        .products-list .weui-media-box__title .delete{
            position: absolute;
            right: 0;
            top: 50%;
            color:#898a8a;
            -webkit-transform:translate(0,-50%);
            /*background:url(images/icon28.png) no-repeat;*/
            background-size: 24px;
            width: 24px;
            height: 24px;

        }
        .products-list .weui-cell:before{
            border-top: none;
        }
        .products-list .weui-cell{
            padding:0 10px 10px;
        }
        .products-list .weui-cell__ft{
            color:#e3313d;
        }
        .products-list .total{
            padding:10px 0;
            margin:0 10px;
            border-top: 1px solid #ececec;
        }
        .quantity{
            border:1px solid #c7c7c7;
            height: 35px;
            display: inline-block;
            overflow: hidden;
            border-radius: 3px;
        }
        .quantity a{
            width: 35px;
            height: 35px;
            line-height: 35px;
            display: inline-block;
            font-size: 20px;
            text-align: center;
        }

        .quantity a:not(.weui-btn_disabled):active {
            background-color: #ececec;
        }
        .quantity input{
            width: 50px;
            height: 35px;
            text-align: center;
            border:none;
            vertical-align: top;
            font-size: 16px;
        }
        .quantity .subtract{
            border-right: 1px solid #c7c7c7;
        }
        .quantity .plus{
            border-left: 1px solid #c7c7c7;
        }
    </style>
</head>
<body style="background:#f3f3f3;">
<div id="root" class="weui-panel weui-panel_access products-list">
    <div class="weui-panel__bd" >
        <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
            <!--  <div class="weui-media-box__hd">
               <img class="weui-media-box__thumb" src="images/temp/9.jpg">
             </div> -->
            <div class="weui-media-box__bd">
                <div class="weui-media-box__title">订单信息</div>
                <p class="weui-media-box__desc">礼物名称 {{gift_name}}</p>
                <p class="weui-media-box__desc">描述信息 {{gift_info}}</p>
                <div class="weui-media-box__title">个人信息</div>
                <p class="weui-media-box__desc">姓名 {{user_name}}</p>
                <p class="weui-media-box__desc">学号 {{student_id}}</p>
                <p class="weui-media-box__desc">电话号码 {{phone_number}}</p>
                <p class="weui-media-box__desc">地址 {{address}}</p>
            </div>
        </a>
        <!-- <div class="weui-cell">
            <div class="weui-cell__bd">
              <div class="price">￥399.00</div>
            </div>
            <div class="weui-cell__ft">
                <div class="quantity">
                    <a href="javascript:void(0);" class="subtract">-</a><input type="tel" value="3"><a href="javascript:void(0);" class="plus">+</a>
                </div>
            </div>
        </div> -->
        <div class="weui-cell total">
            <div class="weui-cell__ft">
                <span>抢礼物结果</span>
            </div>
            <div class="weui-cell__bd"></div>
            <div class="weui-cell__ft">
                <!--		    	<span v-if="order.IsSuccess===1">成功</span>-->
                <!--				<span v-else="order.IsSuccess===1">失败</span>-->
                <span v-if="is_success===1">成功</span>
                <span v-else >失败</span>
            </div>
            </hr>
        </div>
    </div>
    <div class="weui-panel__ft">
        <a href="./searchOrder.html" class="weui-cell weui-cell_active weui-cell_access weui-cell_link">
            <button class="weui-btn weui-btn_primary" id="btn1">查看历史订单</button>
            <!--				<span class="weui-cell__ft"></span>-->
        </a>
    </div>
</div>





<script src="js/jquery.min.js"></script>
<script src="js/jquery-weui.min.js"></script>
<script src="js/fastclick.js"></script>

<script type="text/javascript">
    Vue.config.productionTip = false //组织vue 在启动时生成生产提示。
    window.onload = function(){
        // var objname = getCookie("objname");
        // console.log(objname);
        const xhr = new XMLHttpRequest();
        //设置响应体数据类型
        xhr.responseType = 'json';
        var abc = getQueryString("order_id");
        var sendData = {order_id:abc};
        xhr.open('POST','http://139.224.246.43:8084/orderapi/getOrderByOrderID');
        xhr.setRequestHeader('content-type', 'application/json');
        xhr.send(JSON.stringify(sendData));
        xhr.onreadystatechange = function(){
            if(xhr.readyState === 4&&xhr.status == 200){
                //手动转换
                // let data = JSON.parse(xhr.response);
                // console.log(data);
                // result.innerHTML = data.name;
                new Vue({
                    el:'#root',    //el用于指定当前cue实例为哪个容器服务，通常为css选择器字符串。
                    data:xhr.response.data.Order,
                })
            }
        }

    }
</script>
</script>


</body>
</html>